<template>
  <view class="mine">
    <view class="exam">
      <view class="my-name">
        学号：20002090220
        姓名：刘鸿刚
      </view>
    </view>
    <!-- 用户未登录时，显示登录组件 -->
    <my-login v-if="!token"></my-login>
    <!-- 用户登录后，显示用户信息组件 -->
    <my-user-info v-else></my-user-info>
  </view>
</template>

<script>
// 1. 从 vuex 中按需导入 mapState 辅助函数
import { mapState } from 'vuex'
export default {
  name: 'MinePage',
  computed: {
    // 2. 从 m_user 模块中导入需要的 token 字符串
    ...mapState('m_user', ['token']),
  },
  mounted() {
  },
  data() {
    return {};
  },

  methods: {

  },
};
</script>

<style lang="scss" scoped>
page,
.mine {
  height: 100%;
}

.exam {
  display: flex;
  align-items: center;
  justify-content: center;

  .my-name {
    position: fixed;
    z-index: 999;
    padding: 10px;
    background-color: red;
    color: white;
    top:20px;
    border-radius: 5px;
    opacity: .8;
  }
}
</style>